﻿@model   CartIndexModel
@{
    ViewBag.Title = "我的购物车";
    Layout = "~/Views/Shared/_UserLayout.cshtml";
}


    @section Head{
    <link href="~/common/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
    <style>
        .bz {
            width: 100px;
        }
    </style>
        }

    <div id="shop_cart">
        <!--提示购物步骤-->

        <div class="prompt_step">
            <img src="~/common/images/cart_step_01.png" />
        </div>
        <!--购物车商品-->
        <div class="Shopping_list">
            <div class="title_name">
                <ul>
                    <li class="checkbox">&nbsp;</li>
                    <li class="name">商品名称</li>
                    <li class="scj">市场价</li>
                    <li class="bdj">本店价</li>
                    <li class="sl">购买数量</li>
                    <li class="xj">小计</li>
                    <li class="bz">包装类型</li>
                    <LI class="cz">操作</LI>
                </ul>
            </div>
            <div class="shopping">
                <form method="post" id="form1" action="">
                    <table class="table_list">
                        @foreach (var item in Model.CartRecordDTOs)
                        {
                            <tr class="tr">
                                <td class="checkbox"><input name="CartRecordIds" type="checkbox" value="@item.Id" /></td>
                                <td class="name">
                                    <div class="img"><a href="#"><img src="http://static.amortal.top/@(Model.GoodImgSrcDTOs.SingleOrDefault(e=>e.GoodId==item.GoodId).ThumImgSrc)" /></a></div>
                                    <div class="p_name"><a href="#">@item.GoodName</a></div>
                                </td>
                                <td class="scj sp shichang">￥@item.GoodPre_Price</td>
                                <td class="bgj sp bendian">￥@item.GoodPrice</td>
                                <td class="sl">
                                    <div class="Numbers">
                                        <a href="javascript:void(0);" onclick="jianClick(@item.Id)" class="jian">-</a>
                                        <input id="number_@item.Id" onchange="numberChange(@item.Id)" type="text" value="@item.Count" class="number_text count" />
                                        <a href="javascript:void(0);" onclick="jiaClick(@item.Id)" class="jia">+</a>
                                    </div>
                                </td>
                                <td class="xj">￥@item.GoodPrice</td>
                                <td>@item.PackName</td>
                                <td class="cz">
                                    <p><a href="javascript:void();" onclick="del(@(item.Id),this)">删除</a></p><P>
                                    </P>
                                    <p><a href="javascript:void();">收藏该商品</a></p>
                                </td>
                            </tr>
                        }
                    </table>
                    <div class="sp_Operation">
                        <div class="select-all">
                            <div class="cart-checkbox"><input type="checkbox" id="CheckedAll" class="jdcheckbox" clstag="clickcart" />全选</div>
                            <div class="operation"><a href="javascript:void(0);" id="send">删除选中的商品</a></div>
                            <div class="operation"><span>共计：@(Model.CartRecordDTOs.Length)件商品</span></div>
                        </div>

                        <!--结算-->
                        <div class="toolbar_right">
                            <div class="p_Total">
                                <span class="text">商品总价：</span><span class="price sumPrice zongjia" id="zongjia">0</span>元
                            </div>
                            <div class="Discount"><span class="text">以节省：</span><span class="price" id="jiesheng">0</span>元</div>
                            <div class="btn">
                                <a class="cartsubmit" id="goBalance" href="javascript:void();"></a>
                                <a class="continueFind" href="/Home/Index"></a>
                            </div>
                        </div>
                    </div>
                </form>
            </div>

        </div>

        <!--结束-->
    </div>

@section FooterScript{
    <script src="~/common/Threelinkage/layui/layui.js"></script>
    <script type="text/javascript">

        layui.use("layer", function () {
            var layer = layui.layer;
        });

        function CacleJiaGe() {
            var $sczj = $('.shichang');
            var $bdzj = $('.bendian');
            var jiesheng = 0//parseInt($('#jiesheng').html());
            var zongjia = 0//parseInt($('#zongjia').html());
            for (var i = 0; i < $sczj.length; i++) {
                jiesheng += parseFloat($($sczj[i]).html().substring(1)) - parseFloat($($bdzj[i]).html().substring(1));
                zongjia += (parseFloat($($bdzj[i]).html().substring(1)) * parseInt($('.count')[i].value));
            }
            $('#jiesheng').html(jiesheng);
            $('.zongjia').html(zongjia);
        }
        CacleJiaGe();

        //数量框改变事件
        function numberChange(goodid) {
            var count = $('#number_' + goodid + '').val();
            CacleJiaGe();


            if (!/^[0-9]*$ /.test(count)) {
                return false;
            }
            if (count < 1) {
                count = 1;
            }
            else if (count > 10000) {
                count = 10000;
            }
            $.ajax({
                url: "/Cart/UpdateCartGoodCount",
                data: { Count: count, CartRecordId: goodid },
                type: "post",
                dataType: "json",
                success: function (res) {
                    if (res.status == "ok") {
                        $('#number_' + goodid + '').val(count);
                    } else if (res.status == "redirect") {
                        location.href = res.data;
                    } else if (res.status == "error") {
                        alert(res.errorMsg);
                        return false;
                    } else {
                        alert("失败");
                        return false;
                    }
                }, error: function () {
                    alert("网络请求错误");
                }
            });
        }
        //数量减1
        function jianClick(goodid) {
            CacleJiaGe();
            var count = $('#number_' + goodid + '').val();
            count--;
            if (count < 1 || count > 10000) {
                count = 1;
                return false;
            }
            $.ajax({
                url: "/Cart/UpdateCartGoodCount",
                data: { Count: count, CartRecordId: goodid },
                type: "post",
                dataType: "json",
                success: function (res) {
                    if (res.status == "ok") {
                        $('#number_' + goodid + '').val(count);
                    } else if (res.status == "redirect") {
                        location.href = res.data;
                    } else if (res.status == "error") {
                        alert(res.errorMsg);
                        return false;
                    } else {
                        alert("失败");
                        return false;
                    }
                }, error: function () {
                    alert("网络请求错误");
                }
            });
        }
        //数量加1
        function jiaClick(goodid) {
            CacleJiaGe();
            var count = $('#number_' + goodid + '').val();
            count++;
            if (count < 1 || count > 10000) {
                count = 1;
                return false;
            }

            $.ajax({
                url: "/Cart/UpdateCartGoodCount",
                data: { Count: count, CartRecordId: goodid },
                type: "post",
                dataType: "json",
                success: function (res) {

                    if (res.status == "ok") {
                        $('#number_' + goodid + '').val(count);
                    } else if (res.status == "redirect") {
                        location.href = res.data;
                    } else if (res.status == "error") {
                        alert(res.errorMsg);
                        return false;
                    } else {
                        alert("失败");
                        return false;
                    }
                }, error: function () {
                    alert("网络请求错误");
                }
            });

        }

        function del(cartRecordId, element) {
            layer.confirm('确认删除？', {
                btn: ['确认', '取消'] //按钮
            }, function () {
                $.ajax({
                    url: "/Cart/Delete",
                    data: { CartRecordId: cartRecordId },
                    type: "post",
                    dataType: "json",
                    success: function (res) {
                        if (res.status == "ok") {
                            $(element).parent().parent().parent().remove();
                            layer.msg("删除成功", { icon: 1, time: 1000 });
                        } else if (res.status == "redirect") {
                            location.href = res.data;
                        } else if (res.status == "error") {
                            layer.msg(res.errorMsg, { icon: 2, time: 1000 });
                            return false;
                        } else {
                            layer.msg("失败", { icon: 2, time: 1000 });
                            return false;
                        }
                    }, error: function () {
                        layer.msg("网络错误", {icon:2,time:1000});
                    }
                });
            }, function () {

            });
        }

        $(document).ready(function () {
            //全选
            $("#CheckedAll").click(function () {
                if (this.checked) {                 //如果当前点击的多选框被选中
                    $('input[type=checkbox][name=CartRecordIds]').attr("checked", true);
                    $('#goBalance').show();
                } else {
                    $('input[type=checkbox][name=CartRecordIds]').attr("checked", false);
                    $('#goBalance').hide();
                }
            });
            $('input[type=checkbox][name=CartRecordIds]').click(function () {
                var flag = true;
                var isCheck = false;
                $('input[type=checkbox][name=CartRecordIds]').each(function () {
                    if (!this.checked) {
                        flag = false;
                    }
                    else {
                        isCheck = true;
                    }
                });
                if (isCheck) {
                    $('#goBalance').show();
                } else {
                    $('#goBalance').hide();
                }
                if (flag) {
                    $('#CheckedAll').attr('checked', true);
                } else {
                    $('#CheckedAll').attr('checked', false);
                }
            });
            //输出值
            $("#send").click(function () {
                if ($("input[type='checkbox'][name='CartRecordIds']:checked").attr("checked")) {
                    layer.confirm('确认删除？', {
                        btn: ['确认', '取消'] //按钮
                    }, function () {
                        var json = $('#form1').serialize();
                        console.log(json);
                        $.ajax({
                            url: "/Cart/BathDelete",
                            data: json,
                            type: "post",
                            dataType: "json",
                            success: function (res) {
                                if (res.status == "ok") {
                                    location.reload();
                                } else if (res.status == "redirect") {
                                    location.href = res.data;
                                } else if (res.status == "error") {
                                    layer.msg(res.errorMsg, { icon: 2, time: 1000 });
                                    return false;
                                } else {
                                    layer.msg("失败", { icon: 2, time: 1000 });
                                    return false;
                                }
                            }, error: function () {
                                layer.msg("网络错误", { icon: 2, time: 1000 });
                            }
                        });
                    }, function () {
                    });

                }
                else {
                    layer.msg("你未选中任何商品，请选择后在操作！", {icon:2,time:1000});
                }

            });           

            $('#goBalance').hide();

            $('#goBalance').click(function () {

                var json = $('#form1').serialize();

                if (json=="") {
                    layer.msg("请选择商品", {icon:2,time:1000});
                    return false;
                }

                $.ajax({
                    url:"/Cart/BuyGood",
                    data:json,
                    dataType:"json",
                    type:"post",
                    success:function  (res){
                        if (res.status == "ok") {
                            //TODO:跳转到订单页面
                            location.href="/Order/CreateByCart";
                        } else if (res.status == "redirect") {
                            location.href = res.data;
                        } else if (res.status == "error") {
                            layer.msg(res.errorMsg, { icon: 2, time: 1000 });
                            return false;
                        } else {
                            layer.msg("失败", { icon: 2, time: 1000 });
                            return false;
                        }
                    },error:function () {
                        layer.msg  ("网络错误",{icon:2,time:1000});
                    }
                });

                return false;
            });

        })
    </script>

}